﻿@model WebApp.Data.tbl_block
@{
    ViewBag.Title = "Designer";
    Layout = "~/Views/Shared/_LayoutDesigner.cshtml";
}
<h2>@Model.block_code</h2>
@using (Html.BeginForm("UpdateEdit", "Block", FormMethod.Post))
{
    <div class="container">
        <div class="row">
            <div id="canvas" class="span6">
                <div id="tools" class="row-fluid">
                    <div class="btn-group pull-left" data-toggle="buttons-radio">
                        <button id="btnMove" type="button" class="btn btn-primary tool" data-tools="move">
                            <i class="icon icon-move"></i>
                        </button>
                        <button id="btnEdit" type="button" class="btn btn-primary tool active" data-tools="edit">
                            <i class="icon icon-pencil"></i>
                        </button>
                        <button id="btnDelete" type="button" class="btn btn-primary tool" data-tools="delete">
                            <i class="icon icon-trash"></i>
                        </button>
                    </div>
                    <div class="btn-group pull-left">
                        <button id="btnZoomIn" type="button" class="btn">
                            <i class="icon icon-zoom-in"></i>
                        </button>
                        <button id="btnZoomOut" type="button" class="btn">
                            <i class="icon icon-zoom-out"></i>
                        </button>
                    </div>
                </div>
                <div id="svgcanvas" style="height: 300px; background-color: #EEEEEE;">
                </div>
            </div>
            <div id="list" class="span6">
            </div>
        </div>
        <br/>
        <div>
            <input type="text" name="block_id" id="blockId" value="@Model.block_id" />
            <input type="text" name="block_wide" id="blockWide" value="@Model.block_wide" />
            <input type="text" name="block_long" id="blockLong" value="@Model.block_long" />
            <input type="text" name="block_outline_" id="txtPaving" value='@Model.block_outline_' />
            <button class="btn" type="submit" id="btnSubmit">
                Save Change</button> | @Html.ActionLink("Back", "Edit", new { id = Model.block_id })
        </div>
    </div>
}
@*<input type="button" id="btnCapture"/>*@
<script type="text/javascript">

    //    $("#btnCapture").click(function () {
    //        html2canvas($("#svgcanvas"), {
    //            onrendered: function (canvas) {
    //                document.body.appendChild(canvas);
    //            }
    //        });
    //    });

    $(document).ready(function () {

    });

</script>
<script id="tableTemplate" type="text/template">
            <h3>List</h3>
            <table id="tablePoint" class="table table-bordered">
                <thead>
                    <tr>
                        <th>X</th>
                        <th>Y</th>
                        <th>Actions</th>
                    </tr>
                </thead>
                <tbody id="point-list"></tbody>
            </table>
            <button type="button" id="add-point" class="btn">Add Point</button>
</script>
<script id="pointTemplate" type="text/template">
        <td><input type="text" class="input-block-level posX" name="posX" value="<%=posX %>" /></td>
        <td><input type="text" class="input-block-level posY" name="posY" value="<%=posY %>" /></td>
        <td>
            <div class="btn-group">
                <a class="btn dropdown-toggle" data-toggle="dropdown" href="#">
                    Action
                    <span class="caret"></span>
                </a>
                <ul class="dropdown-menu">
                    <li><a class="move-up">Move Up</a></li>
                    <li><a class="move-down">Move Down</a></li>
                    <li><a class="destroy">Delete</a></li>
                </ul>
            </div>
        </td>
</script>
@*<script type="text/javascript" src="js/jquery-1.9.1.min.js"></script>
    <script type="text/javascript" src="js/underscore-min.js"></script>
    <script type="text/javascript" src="js/backbone-min.js"></script>
    <script type="text/javascript" src="js/backbone.localStorage-min.js"></script>
    <script type="text/javascript" src="js/bootstrap.min.js"></script>
    <script type="text/javascript" src="js/raphael-min.js"></script>
    <script type="text/javascript" src="blockdesigner.js"></script>*@

<script src="@Url.Content("~/Scripts/tools/js/underscore-min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/tools/js/backbone-min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/tools/js/backbone.localStorage-min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/tools/js/bootstrap.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/tools/js/raphael-min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/tools/outlinedesigner.js")" type="text/javascript"></script>
